<template>
  <div class="dashboard-container">
    <div class="app-container">
      <el-card shadow="never">
        <el-form
          :model="ruleForm"
          :rules="rules"
          ref="ruleForm"
          label-width="100px"
          class="demo-ruleForm"
        >
          <el-form-item label="学科" prop="subjectName">
            <el-select
              v-model="ruleForm.items.subjectName"
              placeholder="请选择学科"
            >
              <el-option
                v-for="item in ruleForm.items"
                :key="item.id"
                :label="item.subjectName"
                :value="item.subjectName"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="目录" prop="directoryName">
            <el-select
              v-model="ruleForm.directorys.directoryName"
              placeholder="请选择目录"
            >
              <el-option
                v-for="item in ruleForm.directorys"
                :key="item.id"
                :label="item.directoryName"
                :value="item.directoryName"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="企业" prop="directoryName">
            <el-select
              v-model="ruleForm.companys.company"
              placeholder="请选择企业"
            >
              <el-option
                v-for="item in ruleForm.companys"
                :key="item.id"
                :label="item.company"
                :value="item.company"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="方向" prop="direction">
            <el-select v-model="ruleForm.direction" placeholder="请选择方向">
              <el-option
                v-for="item in ruleForm.direction"
                :key="item.id"
                :label="item.direction"
                :value="item.direction"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-form>
      </el-card>
    </div>
  </div>
</template>

<script>
// import { setRecords } from '@/api/hmmm/questions.js'
import { subjectsList } from '@/api/hmmm/subjects.js'
import { directorysList } from '@/api/hmmm/directorys.js'
import { companysList } from '@/api/hmmm/companys.js'
import { direction } from '@/api/hmmm/constants.js'
export default {
  data () {
    return {
      ruleForm: {
        items: {
          subjectName: ''

        },
        directorys: {
          directoryName: ''
        },
        companys: {
          company: ''
        },
        direction

      },
      rules: {}
    }
  },
  mounted () {
    this.fetchSubjectList()
    this.fetchdirectorysList()
    this.fetchCompanysList()
  },
  methods: {
    async fetchSubjectList () {
      const res = await subjectsList()
      // console.log(res)
      this.ruleForm.items = res.data.items
    },
    async fetchdirectorysList () {
      const res = await directorysList()
      // console.log(res)
      this.ruleForm.directorys = res.data.items
    },
    async fetchCompanysList () {
      const res = await companysList()
      // console.log(res)
      this.ruleForm.companys = res.data.items
    }

  }
}
</script>

<style scoped></style>
